<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>表单元素示例 Form element gallery--JQUERY MOBILE 中文API站</title>
<meta name="keywords" content="JQUERY MOBILE 1.0正式版中文手册,Jquery Mobile 1.0,Jquery mobile,移动框架开发手册,darklord,JQUERY MOBILE 1.0正式版,JQUERY API,jqmapi,jqm,jquery," />
<meta name="description" content="Jquery mobile中文API站，Jquery mobile 1.0正式版本中文手册，提供最新版Jquery mobile移动web与应用开发帮助。" />
<link rel="stylesheet" type="text/css" href="../../style/Jqueryapi.css" tppabs="http://www.jqmapi.com/style/Jqueryapi.css" />
<script src="../../style/lib/jquery-1.6.1.min.js" tppabs="http://www.jqmapi.com/style/lib/jquery-1.6.1.min.js"></script>
<script src="../../style/jqmapi.js" tppabs="http://www.jqmapi.com/style/jqmapi.js"></script>
<link rel="shortcut icon" href="../../style/img/favicon.ico" />
</head>
<body>
<div class="nav">
<iframe width="250px" scrolling="no" frameborder="0" allowtransparency="true" src="../../nav.html" tppabs="http://www.jqmapi.com/nav.html" height="1300px"></iframe>
</div>
<div class="main">
<script src="style/jqmapi.js" tppabs="http://www.jqmapi.com/componts/form/style/jqmapi.js" type="text/javascript"></script>
<hr style="color:#595959;" />

<div class="content">
				<h1>表单元素示例 Form element gallery</h1>
				<div class="desc">
                <div>此页面包含了通过渐进增强驱动的表单元素。原生的表单元素有时被隐藏了，但他们的value值被保存了，所以表单可以正确的提交</div>
				<div>不支持自定义组件的浏览器也能使用它们，因为所有表单组件都基于原生的html表单元素.</div>
                </div>
    	<p class="indent"><strong>文本输入框 Text inputs</strong></p>
		<img src="../../images/form element/text.png" tppabs="http://www.jqmapi.com/images/form%20element/text.png">		
  <hr />
		<p class="indent"><strong>文本输入域 Textarea:</strong></p>
		<img src="../../images/form element/area.png" tppabs="http://www.jqmapi.com/images/form%20element/area.png">		
  <hr />
  
 		<p class="indent"><strong>搜索输入框 Search inputs</strong></p>
		<img src="../../images/form element/serach.png" tppabs="http://www.jqmapi.com/images/form%20element/serach.png">		
  <hr />	
  
 		<p class="indent"><strong>滑动条 Slider</strong></p>
		<img src="../../images/form element/slider.png" tppabs="http://www.jqmapi.com/images/form%20element/slider.png">		
  <hr />
  
 		<p class="indent"><strong>开关 Flip toggle switches</strong></p>
		<img src="../../images/form element/switch.png" tppabs="http://www.jqmapi.com/images/form%20element/switch.png">		
  <hr />	
  
  		<p class="indent"><strong>复选按钮 checkbox</strong></p>
		<img src="../../images/form element/checbox.png" tppabs="http://www.jqmapi.com/images/form%20element/checbox.png">		
  <hr />  	
  
	  		<p class="indent"><strong>文字设置</strong></p>
		<img src="../../images/form element/checbox2.png" tppabs="http://www.jqmapi.com/images/form%20element/checbox2.png">		
  <hr />  
  
	<p class="indent"><strong>单选按钮组 radiobox</strong></p>
		<img src="../../images/form element/radiobox1.png" tppabs="http://www.jqmapi.com/images/form%20element/radiobox1.png">	
  <hr /> 
  
 	<p class="indent"><strong>列表按钮?select</strong></p>
		<img src="../../images/form element/option1.png" tppabs="http://www.jqmapi.com/images/form%20element/option1.png">
  <hr /> 
  
  	<p class="indent"><strong>按钮 button</strong></p>
		<img src="../../images/form element/btn.png" tppabs="http://www.jqmapi.com/images/form%20element/btn.png">
  <hr />  
</div>
</div>
<iframe id="iFrame1" width="160px" scrolling="no" frameborder="0" allowtransparency="true" src="../../adsense_r.html" tppabs="http://www.jqmapi.com/adsense_r.html" onload="this.height=iFrame1.document.body.scrollHeight" ></iframe>
</body>
</html>



